<template>
<view>
<scroll-view scroll-y class="scroll-y" :scrollIntoView="currentIndex" scrollWithAnimation="true" style="height:100vh">
	<search url="/pages/card/search/search?is_collect=1"></search>
	<form reportSubmit @submit="formSubmit">
		<view class="cell-list">
			<button @tap="goUrl" class="cell-item  share-btn" data-must="true" data-url="/pages/card/camera/camera" formType="submit">
            <!--tt:if="{{shibie_type==1}}"-->
                <image class="avatar" src="/static/images/book/camera.png"></image>
                <view class="ml-lg flex-1 ellipsis">
                    <view class="f-title-lg">存纸质名片</view>
                    <view class="c-caption f-paragraph ellipsis">拍照识别纸质名片</view>
                </view>
            </button>
            <button @tap="goUrl" class="cell-item  share-btn b-1px-t" data-must="true" data-url="/pages/group/list/list" formType="submit">
                <image class="avatar" src="/static/images/book/group.png"></image>
                <view class="ml-lg flex-1 ellipsis ">
                    <view class="f-title-lg">群名片</view>
                    <view class="c-caption f-paragraph ellipsis">邀请微信好友加入</view>
                </view>
            </button>
            <button @tap="goUrl" class="cell-item share-btn b-1px-t" data-must="true" data-url="/radar/pages/info/index/index" formType="submit">
            <!--tt:if="{{radar.switch==1&&isNormalVs}}"-->
                <image class="avatar" src="/static/images/book/radar.png"></image>
                <view class="ml-lg flex-1 ellipsis ">
                    <view class="f-title-lg">AI雷达</view>
                    <view class="c-caption f-paragraph ellipsis">客户数据追踪、统计、AI分析</view>
                </view>
            </button>
        </view>
    </form>
    <view>
      <!-- tt:if="{{recommend.length>0}}"-->
        <view class="cell-list-title ">推荐名片</view>
        <view class="cell-list b-1px-tb">
            <view @tap="goUrl" :class="'collect-item ' + (index>0?'b-1px-t':'')" :data-url="'/pages/card/home/home?uid=' + item.uid" :tt:for="recommend" :tt:key="index">
              <!--tt:for="{{recommend}}" tt:key="{{index}}"-->
                <image class="avatar" :src="item.person_avatar_thumb||item.person_avatar"></image>
                <view class="ml-lg flex-1 ellipsis">
                    <view class="f-title-lg c-title">{{item.name}}</view>
                    <view class="c-caption f-paragraph ellipsis">{{item.company_name}}</view>
                </view>
            </view>
        </view>
    </view>
    <form reportSubmit @submit="formSubmit">
        <view :tt:for="my_collect_list" tt:for-index="pindex" tt:for-item="pitem" :tt:key="pindex">
          <!-- tt:for="{{my_collect_list}}" tt:for-index="pindex" tt:for-item="pitem" tt:key="{{pindex}}"-->
            <view class="cell-list-title__zimu " :id="pitem.zimu">{{pitem.zimu}}</view>
            <view class="collect-list b-1px-tb">
                <view @tap.stop="goUrl" :data-url="item.own_uid?'/pages/card/camera/add?id='+item.id:'/pages/card/home/home?uid='+item.card_uid">
                <!-- tt:for="{{pitem.data}}" tt:key="{{index}}"-->
                    <swiper-out @change="handerSwiperChange" :data-index="index" :data-pindex="pindex" height="128" operateWidth="200" :value="item.switch||'off'">
                        <view slot="content">
                            <button :class="'collect-item ' + (index>0?'b-1px-t':'') + ' share-btn'" formType="submit">
                                <image class="avatar" :src="item.person_avatar_thumb||item.person_avatar"></image>
                                <view class="ml-lg flex-1 ellipsis">
                                    <view class="flex-y-baseline flex-1 ">
                                        <view class="f-title-lg c-title">{{item.name}}</view>
                                        <view class="c-caption f-caption ml-md ellipsis">{{item.position}}</view>
                                        <tag class="ml-md" :tt:if="item.own_uid">未认领</tag>
                                        <!--tt:if="{{item.own_uid}}"-->
                                    </view>
                                    <view class="c-caption f-paragraph ellipsis">{{item.company_name||item.introduce||'还没有个人介绍'}}</view>
                                </view>
                            </button>
                        </view>
                        <view slot="operate">
                            <view class="flex-center " style="height:128rpx">
                                <view @tap.stop="delOut" class="flex-center" :data-id="item.id" :data-index="index" :data-pindex="pindex" style="background:#ff3a31;color:#fff;flex:1;height:128rpx;" :tt:if="item.own_uid">取消收藏</view>
                                <!-- tt:if="{{item.own_uid}}"-->
                                <view @tap.stop="collect" class="flex-center" :data-card_id="item.card_id" :data-index="index" :data-mode="-1" :data-pindex="pindex" :data-type="3" style="background:#ff3a31;color:#fff;flex:1;height:128rpx;">取消收藏</view>
                                <!-- tt:else-->
                            </view>
                        </view>
                    </swiper-out>
                </view>
            </view>
        </view>
    </form>
    <view class="space-lg"></view>
</scroll-view>
<view class="index-float-block" :style="'opacity:' + (currentIndex?1:0)">{{currentIndex}}</view>
<!--tt:if="{{currentIndex}}"-->
<view catchtouchend="selectTouchEndHandler" catchtouchmove="selectTouchMoveHandler" catchtouchstart="selectTouchStartHandler" class="index-selector-wrap">
    <view class="index-selector-item" :style="'top: ' + (index*16) + 'px'">{{item.zimu}}
      <!-- tt:for="{{my_collect_list}}" tt:key="index"-->
  </view>
</view>
<view class="space fixed-bottom"></view>
<login @success="loginSuccess" :show="showLogin"></login>
</view>
</template>

<script>
// pages/card/book/book.js
let app = getApp();
import search from "../../../components/search/index";

export default {
  data() {
    return {};
  },

  components: {
    search
  },
  props: {},
  onLoad: function (options) {},
  methods: {}
};
</script>
<style>
.index-selector-wrap {
    position: fixed;
    z-index: 100;
    font-size: 24rpx;
    right: 0px;
    top: 300rpx;
    text-align: center;
    width: 30px;
    color: #2e2d2f;
    border-radius: 5px;
}

.index-selector-wrap .index-selector-item {
    width: 30px;
    text-align: center;
    height: 20px;
}

.index-float-block {
    transition: opacity 1s;
    opacity: 0;
    position: fixed;
    text-align: center;
    width: 200rpx;
    height: 200rpx;
    left: 275rpx;
    top: 40vh;
    border-radius: 50px;
    background-color: rgba(0,0,0,0.5);
    font-size: 100rpx;
    line-height: 200rpx;
    color: white;
    z-index: 200;
}

.collect-list {
    padding: 2rpx 0 2rpx 32rpx;
    background: #fff;
}

.collect-item {
    height: 128rpx;
    background: #fff;
    display: flex;
    align-items: center;
    overflow: hidden;
}

.collect-item__img {
    margin-right: 50rpx;
}

.cell-list-title__zimu {
    height: 40rpx;
    line-height: 40rpx;
    padding: 0 32rpx;
    color: #888;
    font-size: 26rpx;
}
</style>